// 基于axios封装网络请求
import ajax from 'axios'
import { Notify } from 'vant'
import router from '@/router'
import { getToken,removeToken } from './token'
// 新建一个新的axios实例
const axios = ajax.create({
    baseURL: 'http://toutiao.itheima.net',
    timeout: 20000 // 20秒超过时间(请求20秒无响应判定超时)
})

// 添加请求拦截器
axios.interceptors.request.use(function (config) {
    // 在发请求之前做些什么
    // 目标：统一携带token
    // 判断本地有token再携带,判断具体api/index.js里如果没有携带Authorization,再添加
    // 未定义叫undefined,null具体的值赋予才叫空
    // ?. 可选链操作符,如果前面对象里没有length,整个表达式原地返回undefined
    // 如果getToken() 在原地有值token字符串,才能调用length获取长度
    if(getToken()?.length > 0 && config.headers.Authorization === undefined) {
        config.headers.Authorization = `Bearer ${getToken()}`
    }
    return config
},function (error) {
    // 请求错误做点什么
    return Promise.reject(error)
})

// 添加响应拦截器
// 本质：就是一个函数
axios.interceptors.response.use(function (response) { 
    // 当状态码为2xx/3xx开头的进这里
    // 对响应数据做点什么
    return response
}, async function (error) { 
    // 响应状态码4xx/5xx进这里
    // 对响应错误做点什么
    // console.dir(error)
    if (error.response.status === 401) { 
        // 身份过期
        // 不能使用this.$router(因为this不是vue组件对象无法调用$router)
        // 解决：this.$router为了拿到router路由对象,所以直接去上面引入@/router下router对象
        Notify({type: 'warning', message: '身份以过期'})
        removeToken() // 先清除token,才能让路由守卫判断失效,放行去登陆页
        router.replace('/login')
    } 
    return Promise.reject(error)
})

// 导入自定义函数,参数对象结构赋值
export default ({url, method = 'GET', params = {}, data = {} , headers = {}}) => {
    return axios({
        url,
        method,
        params,
        data,
        headers
    })
}